import React from 'react';
import { Link } from 'react-router-dom';
import { root } from '@/router/router.config';
import { useSelector } from 'react-redux';
import type { RootState } from '@/store';
import type { IUserInfo } from '@/api';
import './index.scss';

interface ILogo {
  darkly: boolean;
}

const Logo: React.FC<ILogo> = (prop) => {
  const { darkly } = prop;
  const { corpName, corpLogoImage } = useSelector<RootState, IUserInfo>(state => state.user.userInfo)
  return (
    <Link to={root}>
      <div className={`hi-pro-global-header-logo ${darkly ? 'darkly' : ''}`}>
        {corpLogoImage?<img src={corpLogoImage} alt={corpName} />:null}
        <h1>{corpName}</h1>
      </div>
    </Link>
  )
}

export default Logo
